<template>
  <div class="wrapper-layout">
    <layout 
        :title="title"
        :logo="logo"
        :assist="assist"
        :dev="true"
        @assist="visible = true"
    >
      <assist
        slot="assist"
        :visible="visible"
        @question="handleQuestion"
        @close="handleClose"
        :messages="messages"
      />
    </layout>
  </div>
</template>

<script>
const { title, tgName, bucketName } = require("$root/base.config.js");
import { Layout, Assist } from 'vue-lcd-engine/components/index.js'
import { APIQuestion } from '@/api/llm'
export default {
  name: 'WrapperLayout',
  components: {
    Layout,
    Assist,
  },
  data() {
    return {
      title: title,
      logo: tgName + "/" + bucketName + "/logo.png",
      assist: tgName + "/" + bucketName + "/assist.png",
      visible: false,
      messages: [],
    }
  },
  methods: {
    handleClose() {
      this.visible = false
    },
    async handleQuestion(data) {
      const result = await APIQuestion(data)
      console.log('result', result)
      if (result.code == 0) {
        this.messages = result.data
      }
    },
  },
}
</script>

<style lang="less" scoped>
.wrapper-layout {
    height: 100%;
}
</style>
